<template>
    <div class="local">
        <div class="base_header">
            <img @click="goBack()" class="back" src="../../assets/img/back.png" alt="">收货地址管理
        </div>
        <ul class="vertical-list local_list">
            <li v-for="address in addresses">
                <div class="local_info">
                    <p class="p1"><span>{{address.receiver}}</span>
                    	<span class="fr">{{address.userPhone}}</span>
                    </p>
                    <p>{{address.provinceName}}{{address.cityName}}{{address.regionName}}{{address.detailAddr}}</p>
                </div>
                <div class="local_operation" v-if="selectAddress == 'yes'">
                    <!--<img src="../../assets/img/order/radio.png" alt="">-->
                    <img v-if="address.defaultFlag == '1'" src="../../assets/img/order/radio_active.png" alt=""/>
                    <img src="../../assets/img/order/radio.png" alt="" v-if="address.defaultFlag == '0'"
                         @click="setDefault(address);"/><span @click="setDefault(address);">选择收货地址</span>
                    <span class="fr" @click="deleteAddress(address)"><img src="../../assets/img/delete.png"
                                                                          alt="">删除</span>
                </div>
                <div class="local_operation" v-else>
                    <!--<img src="../../assets/img/order/radio.png" alt="">-->
                    <img v-if="address.defaultFlag == '1'" src="../../assets/img/order/radio_active.png" alt=""/>
                    <img src="../../assets/img/order/radio.png" alt="" v-if="address.defaultFlag == '0'"
                         @click="setDefault(address);"/><span @click="setDefault(address);">默认收货地址</span>
                    <span class="fr" @click="deleteAddress(address)"><img src="../../assets/img/delete.png"
                                                                          alt="">删除</span>
                </div>
            </li>

        </ul>
        <router-link :to="{path:'/add_local'}">
            <div class="bts mt100">添加新地址</div>
        </router-link>
    </div>
</template>

<style>
    @import url("./set-local.css");
    @import url("../../../static/js/iosSelect.css");
</style>
<script>
    import Layer from '../../assets/js/MessageBox'
    import API from '../../assets/js/API'
    import Validate from '../../assets/js/Validate'
    import {MessageBox} from 'mint-ui'

    export default {
        data() {
            return {
                selectAddress:this.$route.query.selectAddress,
                addresses: [],
                submitAddresses:[]
            }
        },
        created() {
             window.scrollTo(0,0);
            let url = API.serviceDomain + API.personAddressList;
            this.$http({method: "get", url: url}).then(
                (res) => {
                    if (res.body.status == '000000') {
                        this.addresses = res.body.data.addressList;
                    } else {
                        Layer.showMsg(res.body.message);
                    }
                },
                (error) => {
                    Layer.showMsg("网络错误: 加载失败，请稍候尝试.")
                    return
                }
            )
        },
        mounted() {
            let token = localStorage.getItem('token');
            if (!token) {
                Layer.showMsg("您还未登录!");
                this.$router.push({path: '/login'});
            }
        },
        methods: {
            goBack() {
                this.$router.goBack()
            },
            setDefault(address) {
                for (var i = 0; i < this.addresses.length; i++) {
                    this.addresses[i].defaultFlag = "0";
                }
                address.defaultFlag = "1";
                for(var i = 0; i < this.addresses.length; i++){
                    var submitAddress = {};
                    submitAddress.cityId = this.addresses[i].cityId;
                    submitAddress.defaultFlag = this.addresses[i].defaultFlag;
                    submitAddress.detailAddr = this.addresses[i].detailAddr;
                    submitAddress.id = this.addresses[i].id;
                    submitAddress.provinceId = this.addresses[i].provinceId;
                    submitAddress.receiver = this.addresses[i].receiver;
                    submitAddress.regionId = this.addresses[i].regionId;
                    submitAddress.userPhone = this.addresses[i].userPhone;
                    this.submitAddresses.push(submitAddress);
                }
                let url = API.serviceDomain + API.personAddressModify;
                this.$http.post(url,this.submitAddresses).then(
                    (res) => {
                        if (res.body.status == '000000') {
                            Layer.showMsg("选择成功");
                        } else {
                            Layer.showMsg(res.body.message);
                        }
                    },
                    (error) => {
                        Layer.showMsg("网络错误: 加载失败，请稍候尝试.")
                        return
                    }
                )
            },
            deleteAddress(address) {
                MessageBox.confirm('确定删除?').then(action => {
                    let url = API.serviceDomain + API.personAddressDelete + "/" + address.id;
                    console.log(url);
                    this.$http.post(url).then(
                        (res) => {
                            if (res.body.status == '000000') {
                                Layer.showMsg("删除成功");
                                let url = API.serviceDomain + API.personAddressList;
                                this.$http({method: "get", url: url}).then(
                                    (res) => {
                                        if (res.body.status == '000000') {
                                            this.addresses = res.body.data.addressList;
                                        } else {
                                            Layer.showMsg(res.body.message);
                                        }
                                    },
                                    (error) => {
                                        Layer.showMsg("网络错误: 加载失败，请稍候尝试.")
                                        return
                                    }
                                )
                            } else {
                                Layer.showMsg(res.body.message);
                            }
                        },
                        (error) => {
                            Layer.showMsg("服务器开小差了...")
                            return
                        }
                    )
                });

            }

        }

    }
</script>
